{{ define "mainTitle" }}
  <h5>{{ partial "breadcrumb.html" . }}</h5>
{{ end }}

{{ define "mainBody" }}
  <!-- credit: https://mertbakir.gitlab.io/hugo/tag-cloud-in-hugo/ -->
  <div id="tagcloud-container" class="is-center">
    {{ if ne (len $.Site.Taxonomies.tags) 0 }}
      {{ $largestFontSize := 2.0 }}
      {{ $smallestFontSize := 1.0 }}
      {{ $fontSpread := sub $largestFontSize $smallestFontSize }}
      {{ $max := add (len (index $.Site.Taxonomies.tags.ByCount 0).Pages) 1 }}
      {{ $min := len (index $.Site.Taxonomies.tags.ByCount.Reverse 0).Pages }}
      {{ $spread := sub $max $min }}
      {{ $fontStep := div $fontSpread $spread }}
        {{ range $name, $taxonomy := $.Site.Taxonomies.tags }}
          {{ $tagCount := len $taxonomy.Pages }}
          {{ $currentFontSize := (add $smallestFontSize (mul (sub $tagCount $min) $fontStep) ) }}
          {{ $weigth := div (sub (math.Log $tagCount) (math.Log $min)) (sub (math.Log $max) (math.Log $min)) }}
          {{ $currentFontSize := (add $smallestFontSize (mul (sub $largestFontSize $smallestFontSize) $weigth)) }}
            <a href="{{ "/tags/" | relURL }}{{ $name | urlize }}" class="tagcloud-item" style="font-size: {{ $currentFontSize }}rem;">
              <span class="tag is-small">{{ $name }} ✕ {{ $tagCount }}</span>
            </a>
        {{ end }}
    {{ end }}
  </div>
  <style>
  #tagcloud-container {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
  }
  #tagcloud-container a {
    display: inline-flex;
    align-items: center;
    margin: 0.4rem;
  }
  </style>
{{ end }}
